﻿var _____CallChromeCompentId = '';


top.document.addEventListener('refreshChemUIEvent', function (evt) {
    console.log('------log_chromeInfo----------');
    var cheminfo = evt.detail;
    var _chemdrawPanel = Ext.getCmp(_____CallChromeCompentId);
    if (_chemdrawPanel == undefined || _chemdrawPanel == null)
        return;

    _chemdrawPanel.img = cheminfo.img;
    _chemdrawPanel.cdx = cheminfo.cdx;
    _chemdrawPanel.mol = cheminfo.mol;
    _chemdrawPanel.showImg();
}, false);

function readChemdraw() {
    var evt = top.document.createEvent("CustomEvent");
    evt.initCustomEvent('readChemdrawEvent', true, false, undefined);
    top.document.dispatchEvent(evt);
}

function openMolEvent(mol) {
    console.log('openMolEvent');
    console.log(mol);
    var evt = top.document.createEvent("CustomEvent");
    evt.initCustomEvent('openMolEvent', true, false, mol);
    top.document.dispatchEvent(evt);
}
function openCdxEvent(cdx) {
    console.log('openCdxEvent');
    console.log(cdx);
    var evt = top.document.createEvent("CustomEvent");
    evt.initCustomEvent('openCdxEvent', true, false, cdx);
    top.document.dispatchEvent(evt);
}


//-------------------图片显示----------------------
showImg = function (compId, imgBase64, padding, align) {


    if (imgBase64 == null || imgBase64.length < 10) {
        return;
    }

    if (padding == null) {
        padding = 0;
    }
    if (align == null) {
        align = 'center';
    }


    var sampleStructImgHtml = Ext.getCmp(compId);
    //////////////////////////////
    var iwidth = sampleStructImgHtml.getWidth() - padding * 2;
    var iheight = sampleStructImgHtml.getHeight() - 60;
    console.log('区域尺寸: ' + iwidth + "×" + iheight);

    var image = new Image();
    image.onload = function () {


        console.log('原图尺寸: ' + image.width + "×" + image.height);

        var this_imgWidth = 0;
        var this_imgHeight = 0;

        if (image.width > 0 && image.height > 0) {
            if (image.width / image.height >= iwidth / iheight) {
                if (image.width > iwidth) {
                    this_imgWidth = iwidth;
                    this_imgHeight = (image.height * iwidth) / image.width;
                }
                else {
                    this_imgWidth = image.width;
                    this_imgHeight = image.height;
                }
            }
            else {
                if (image.height > iheight) {
                    this_imgHeight = iheight;
                    this_imgWidth = (image.width * iheight) / image.height;
                } else {
                    this_imgWidth = image.width;
                    this_imgHeight = image.height;
                }
            }

            console.log('图片显示尺寸: ' + this_imgWidth + "×" + this_imgHeight);
            if (this_imgHeight < 30) {
                this_imgHeight = 30;
            }
        }

        var xtpl = new Ext.XTemplate("<table border='0' width='100%'><tr><td  align='" + align + "' height={iheight} valign='middle'><img src='data:image/png;base64,{imgData}'  imgData='{imgData}' ondblclick='showBigPic(this)'  height='{height}' width='{width}' border='{border}'/></td></tr></table>");

        var html = xtpl.applyTemplate({
            imgData: imgBase64,
            height: this_imgHeight,
            iheight: iheight,
            width: this_imgWidth,
            border: false
        });
        sampleStructImgHtml.update(html);
    };

    image.src = 'data:image/png;base64,' + imgBase64;




}

showBigPic = function (sender) {
    var val = sender.attributes.imgData.value;
    if (val && val.length > 2) {


        var vs = Ext.getBody().getViewSize();

        var maxWidth = vs.width, maxHeight = vs.height;

        var win = new Ext.Window({
            title: '原图显示',
            width: maxWidth * 3 / 4,
            height: maxHeight * 3 / 4,
            modal: true,
            autoScroll: true,
            tbar: [{
                xtype: 'button', text: '原图', handler: function () {
                    var p = win.getImgPanel();
                    p.update('<image src="data:image/png;base64,' + val + '"/>');
                }, scope: this
            }, {
                    xtype: 'button', text: '缩放', handler: function () {
                        var p = win.getImgPanel();
                        p.setHeight(win.height - 80);
                        p.setWidth(win.width - 80);
                        p.showImg();
                }, scope: this
            }],
            listeners: {
                afterrender: function () {
                    this.items.add(this.getImgPanel());
                }
            },
            getImgPanel: function () {
                if (!this.ImgPanel) {
                    this.ImgPanel = Ext.create('Ext.panel.Panel', ({
                        xtype: 'panel',
                        autoScroll: true,
                        width: this.width - 80,
                        height: this.height - 80,
                        img: val,
                        html: 'xx',
                        listeners: {
                            afterrender: function () {
                                this.showImg();
                            }
                        },
                        showImg: function () { 
                            showImg(this.getId(), this.img, 10, 'middle');
                        },
                        border: false
                    }));

                }
                return this.ImgPanel;
            }

        }).show();

    }
}